

<include file="public@header" />
</head>
<body>
<div class="wrap js-check-wrap">
    <ul class="nav nav-tabs">
        <li class="active"><a href="{:url('test/index')}">{:lang('ADMIN_USER_INDEX')}</a></li>
        <li><a href="{:url('test/add')}">{:lang('ADMIN_USER_ADD')}</a></li>
    </ul>

    <form class="well form-inline margin-top-20" method="get" >

        用户名:
        <input type="text" class="form-control" name="user_login" style="width: 120px;"  placeholder="请输入用户名">

        邮箱:
        <input type="text" class="form-control" name="user_email" style="width: 120px;"   placeholder="请输入邮箱">

        时间:
        <input type="text" class="form-control js-bootstrap-datetime" name="start_time"
               value="{$start_time|default=''}"
               style="width: 140px;" autocomplete="off">

        分类:
        <select class="form-control" name="category" id="category" style="width: 140px;">
            <option value='0'>全部</option>
            <option value='1'>分类1</option>

        </select> &nbsp;&nbsp;

        <input type="button" id="selectval" class="btn btn-primary" value="搜索" />


        <a class="btn btn-danger" href="{:url('test/index')}">清空</a>
    </form>

    <table class="table table-hover table-bordered">

        <table class="layui-hide" id="test" lay-filter="test"></table>

        <script type="text/html" id="toolbarDemo">
            <div class="layui-btn-container">
                <button class="layui-btn layui-btn-sm" lay-event="getCheckData">获取选中行数据</button>
                <button class="layui-btn layui-btn-sm" lay-event="getCheckLength">获取选中数目</button>
                <button class="layui-btn layui-btn-sm" lay-event="isAll">验证是否全选</button>
            </div>
        </script>
        <script type="text/html" id="barDemo">
            <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
            <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
        </script>

            <!--    自定义    -->
        <script type="text/html" id="titleTpl">
            {{#  if(d.id < 2){ }}
                小于1
            {{#  } else { }}
            大于1
            {{#  } }}
        </script>


        <script>



             layui.use('table', function(){
                var table = layui.table;
                var curl="{:url('Test/getlist')}";

                var tableIns =table.render({
                    elem: '#test' ,
                    url:curl,
                    method: 'post',
                    toolbar: '#toolbarDemo',
                    title: '用户数据表',
                    totalRow: true ,
                    cols: [[
                        {type: 'checkbox', fixed: 'left'}
                        ,{field:'id', title:'ID', width:80, fixed: 'left', unresize: true, sort: true, totalRowText: '合计'}
                        ,{field:'user_nickname', title:'用户名',edit: 'text'}
                        ,{field:'mobile', title:'电话'}
                        ,{field:'balance', title:'余额', sort: true, totalRow: true}
                        ,{field:'sign', title:'签名', templet: '#titleTpl'}
                        ,{field:'joinTime', title:'加入时间'}
                        ,{fixed: 'right', title:'操作', toolbar: '#barDemo'}
                    ]]
                    ,page: true
                });


                $("#selectval").click(function (){

                    var time=$(".js-bootstrap-datetime").val();

                    var category=$("#category").val();

                    console.log(category);

                    tableIns.reload({
                        where: { aaaaaa: 'xxx' ,bbb: 'yyy' } ,
                        page: { curr: 1  }
                    });

                })





                //顶部工具栏事件
                table.on('toolbar(test)', function(obj){
                    var checkStatus = table.checkStatus(obj.config.id);
                    switch(obj.event){
                        case 'getCheckData':
                            var data = checkStatus.data;
                            layer.alert(JSON.stringify(data));
                            break;
                        case 'getCheckLength':
                            var data = checkStatus.data;
                            layer.msg('选中了：'+ data.length + ' 个');
                            break;
                        case 'isAll':
                            layer.msg(checkStatus.isAll ? '全选': '未全选')
                            break;
                    };
                });


                //表格工具行事件
                table.on('tool(test)', function(obj){
                    var data = obj.data;
                    //console.log(obj)
                    if(obj.event === 'del'){
                        layer.confirm('真的删除行么', function(index){
                            obj.del();
                            layer.close(index);
                        });
                    } else if(obj.event === 'edit'){
                        layer.prompt({
                            formType: 2
                            ,value: data.email
                        }, function(value, index){
                            obj.update({
                                email: value
                            });
                            layer.close(index);
                        });


                        layer.open({
                            type: 2,

                            area: ['800px', '600px'],
                            content: curl,
                            success:function (){
                                var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
                                parent.layer.close(index); //再执行关闭
                            }
                        });

                    }
                });


            });
        </script>


    </table>

</div>
<script src="__STATIC__/js/admin.js"></script>
</body>
</html>